Ext.define('AmpleHarvest.objects.Statistics.view.users.cActiveUserCount',
{
	extend			: 'AmpleHarvest.objects.Statistics.absPanel',
	uses			:
	[
		'AmpleHarvestPHP.DATA.Store.statistics.cMetrics'
	],
	requires		:
	[
			'Ext.container.AbstractContainer', 'Ext.form.field.Date'
	],
	title			: 'Active Users',
	layout			:
	{
		type	: 'vbox',
		align	: 'stretch'
	},
	frame			: true,
	initComponent	: function()
	{
		var obj_CurDate = new Date();
		this.obj_Store = Ext
				.create('AmpleHarvestPHP.DATA.Store.statistics.cMetrics');

		this.m_obj_DateSelect = Ext.create('Ext.container.AbstractContainer',
				{
					layout			:
					{
						type			: 'hbox',
						defaultMargins	:
						{
							top		: 5,
							right	: 0,
							bottom	: 0,
							left	: 5
						}
					},

					m_obj_EndDate	: Ext.Date
							.add(obj_CurDate, Ext.Date.DAY, 1),
					m_obj_StartDate	: Ext.Date.add(obj_CurDate, Ext.Date.MONTH,
							-1
					),
					frame			: true,
					items			:
					[
							{
								xtype		: 'datefield',
								fieldLabel	: "Start Date",
								flex		: 1,
								labelWidth	: 75,
								value		: Ext.Date.add(obj_CurDate,
										Ext.Date.MONTH, -1
								),
								listeners	:
								{
									'change'	:
									{
										fn		: function(obj_This, obj_New,
												obj_Old, obj_Options)
										{
											this.m_obj_DateSelect
													.set_StartDate(obj_New);
										},
										scope	: this
									},
									'render'	: function(obj_This,
											obj_Options)
									{
										this.m_obj_DateSelect
												.set_StartDate(obj_This
														.getValue());
									},
									scope		: this
								}
							},
							{
								xtype		: 'datefield',
								fieldLabel	: "End Date",
								flex		: 1,
								labelWidth	: 75,
								value		: Ext.Date.add(obj_CurDate,
										Ext.Date.DAY, 1
								),
								listeners	:
								{
									'change'	:
									{
										fn		: function(obj_This, obj_New,
												obj_Old, obj_Options)
										{
											this.m_obj_DateSelect
													.set_EndDate(obj_New);
										},
										scope	: this
									},
									'render'	:
									{
										fn		: function(obj_This,
												obj_Options)
										{
											this.m_obj_DateSelect
													.set_EndDate(obj_This
															.getValue());
										},
										scope	: this
									}
								}
							},
							{
								xtype	: "button",
								text	: "update",
								handler	: this.updateData,
								scope	: this
							}
					],
					set_StartDate	: function(obj_Date)
					{
						this.m_obj_StartDate = obj_Date;
					},
					get_StartDate	: function()
					{
						return this.m_obj_StartDate;
					},
					set_EndDate		: function(obj_Date)
					{
						this.m_obj_EndDate = obj_Date;
					},
					get_EndDate		: function()
					{
						return this.m_obj_EndDate;
					}
				});

		this.updateData();
		
		this.m_obj_Tip = Ext.create('AmpleHarvest.objects.tips.graph.cLine', {});
		this.m_obj_Chart = Ext.create('AmpleHarvest.objects.chart.cExportable',
		{
			flex	: 1,
			anchor	: "100% 100%",
			animate	: false,
			store	: this.obj_Store,
			axes	:
			[
					{
						type			: 'Numeric',
						position		: 'left',
						fields			:
						[
							'data'
						],
						label			:
						{
							renderer	: Ext.util.Format.numberRenderer('0,0')
						},
						title			: 'Active Users',
						grid			: true,
						minimum			: 0,
						majorTickSteps	: 10,
						minorTickSteps	: 5
					},
					{
						type		: 'Category',
						position	: 'bottom',
						fields		:
						[
							'label'
						],
						label		:
						{
							renderer	: Ext.util.Format.dateRenderer('d/M/Y'),
							rotate		:
							{
								degrees	: 315
							}// ,
							// renderer : Ext.util.Format
							// .dateRenderer('d/m/y h:i:s')
						},
						title		: 'Date'
					}
			],
			series	:
			[
					{
						type		: 'line',
						axis		: 'left',
						highlight	: true,
						tips		:this.m_obj_Tip,

						xField		: 'label',
						yField		: 'data'
					}
			]
		}
		);
		this.callParent();
		this.add(this.m_obj_DateSelect);
		this.add(this.m_obj_Chart);
	},
	updateData		: function()
	{
		var obj_StartDate = this.m_obj_DateSelect.get_StartDate();
		var obj_EndDate = this.m_obj_DateSelect.get_EndDate();
		// var arr_StartDate = new Array();
		// var arr_EndDate = new Array();
		var str_SubType = "";
		var int_DateDelta = 0;

		int_DateDelta = Ext.Date.getElapsed(obj_StartDate, obj_EndDate);

		if (int_DateDelta < (4 * 24 * 60 * 60 * 1000))
		{
			str_SubType = AmpleHarvestPHP.DATA.Store.statistics.cMetrics.C_STR_SUBTYPE_HOURLY;
		}
		else if ((int_DateDelta < (35 * 24 * 60 * 60 * 1000)))
		{
			str_SubType = AmpleHarvestPHP.DATA.Store.statistics.cMetrics.C_STR_SUBTYPE_DAILY;
		}
		else if ((int_DateDelta < (400 * 24 * 60 * 60 * 1000)))
		{
			str_SubType = AmpleHarvestPHP.DATA.Store.statistics.cMetrics.C_STR_SUBTYPE_MONTHLY;
		}
		else
		{
			str_SubType = AmpleHarvestPHP.DATA.Store.statistics.cMetrics.C_STR_SUBTYPE_YEARLY;
		}

		this.obj_Store.setStartDate(this.m_obj_DateSelect.m_obj_StartDate);
		this.obj_Store.setEndDate(this.m_obj_DateSelect.m_obj_EndDate);
		this.obj_Store
				.setType(AmpleHarvestPHP.DATA.Store.statistics.cMetrics.C_STR_TYPE_TOTAL_USERS);
		this.obj_Store.setSubType(str_SubType);
		this.obj_Store
				.setGroup(AmpleHarvestPHP.DATA.Store.statistics.cMetrics.C_STR_GROUP_ACTIVE);

		this.obj_Store.load();
	}
}
);